<template>
	<view class="content">
		<heade title="销货单列表" cross bg_color="bg_fff">
			<!-- <text class="iconfont icon-shaixuan f-s20 f-wbold" @tap="$common.url('/pages/salesOrderList/advanced')"></text> -->
			<text class="iconfont icon-jiahao_o f-s20 m-l5 f-wbold" @tap="$common.url('/pages/parameters/parameters?title=销货单')"></text>
		</heade>
		<view class="">
			<view class="position-fixed bg_fff p-b10" :style="{'top':$common.headHeight()+44 +'px'}" style="width: 100%;border-bottom: 2rpx solid #F8F8F8;">
				<view class="d-flex align-center m-t5 p-b8" style="border-bottom: 2rpx solid #F8F8F8;">
					<view class="sousuo flex1  d-flex align-center m-l10 m-r10">
						<picker @change="bindPickerChange" :value="index" :range="array">
							<view class="d-flex align-center justify-content-space-between m-l15 p-r5" style="width: 160rpx;">
								<view class="uni-input text-center f-s14">{{array[index]}}</view>
								<view class="iconfont icon-sanjiaoxing f-s12"></view>
							</view>
						</picker>
						<input type="text" class="f-s14 m-l10 flex1" @blur="getData" v-if="index == 0" placeholder="搜索商品名称">
						<input type="text" class="f-s14 m-l10 flex1" @blur="getData" v-else placeholder="搜索商品编码">
					</view>
				</view>
				<view class="d-flex align-center justify-content-space-around m-t12 f-s14">
					<!-- 日期 -->
					<!-- <picker @change="dateChange" :value="dateStatus" :range="dateList">
						<view class="d-flex align-center">
							<view v-if="dateStatus == 0">日期</view>
							<view v-else>{{dateList[dateStatus]}}</view>
							<view class="iconfont icon-sanjiaoxing m-l5 f-s10"></view>
						</view>
					</picker> -->
					<view class="d-flex align-center" @tap="show">
						<view v-if="BeginDefault == ''">日期</view>
						<view v-else>{{BeginDefault}} - {{EndDefault}}</view>
						<view class="iconfont icon-sanjiaoxing m-l5 f-s10"></view>
					</view>
					
					<!-- 状态 -->
					<picker @change="dateChange" :value="dateStatus" :range="dateList" range-key="name">
						<view class="d-flex align-center">
							<view v-if="dateStatus == 0">状态</view>
							<view v-else>{{dateList[dateStatus].name}}</view>
							<view class="iconfont icon-sanjiaoxing m-l5 f-s10"></view>
						</view>
					</picker>
					<!-- 类型 -->
					<picker @change="conditionChange" :value="conditionStatus" :range="conditionList" range-key="name">
						<view class="d-flex align-center">
							<view v-if="conditionStatus == 0">类型</view>
							<view v-else>{{conditionList[conditionStatus].name}}</view>
							<view class="iconfont icon-sanjiaoxing m-l5 f-s10"></view>
						</view>
					</picker>
				</view>
			</view>
			<view style="height: 166rpx;"></view>
			
			<view class="">
				<view v-for="item in list" class="flex1 d-flex align-center m-t10 justify-content-space-between p-r15 p-b10" style="border-bottom: 2rpx solid #e8e5e5;">
					<view class="flex1 m-l15">
						<view class="d-flex align-center justify-content-space-between">
							<view class="f-s13">{{item.partnerName}}</view>
							<view class="f-s13 co_0ad161">{{item.voucherState}}</view>
						</view>
						<view class="d-flex align-center justify-content-space-between m-t5 m-b5 ">
							<view class="f-s14 f-wbold">{{item.ConsignorName}}</view>
							<view class="f-s14">{{item.voucherdate}}</view>
						</view>
						<view class="d-flex align-center justify-content-space-between m-t3 f-s13">
							<view class="">{{item.saleDeliveryCode}}</view>
							<view class="f-s13 co_c60001 f-wbold">¥{{item.origDiscountAmount}}</view>
						</view>	
					</view>
					<!-- <view class="p-l20 " @tap="moreClick">
						<view class="iconfont icon-gengduo co_000 f-s20 f-wbold"></view>
					</view> -->
				</view>
				<uni-load-more v-if="more" :status="status"></uni-load-more>
			</view>
		</view>
		
		<view class="b-liuhai" ><view style="height: 70rpx;"></view></view>
		<view style="position: fixed; bottom: 0;width: 100%;z-index: 9;" class="bg_fff">
			<view class="b-liuhai">
				<view class="bg_FFF8EB p-t10 p-b10 p-l12 flex1">
					<!-- <view class="d-flex align-center">
						<view class="f-s14">总单数: <text class="m-l5 d-inline-block" style="min-width: 200rpx;">{{total}}</text></view>
						<view class="f-s14">总金额: <text class="m-l5 co_c60001 d-inline-block" style="min-width: 200rpx;">{{total}}</text></view>
					</view> -->
					<view class="d-flex align-center">
						<view class="f-s14">总数量: <text class="m-l5 d-inline-block" style="min-width: 200rpx;">{{dindanData.TotalRecords}}</text></view>
						<!-- <text class="f-s14" space="nbsp">收   款: <text class="co_c60001 m-l5 d-inline-block" style="min-width: 200rpx;">{{total}}</text></text> -->
					</view>
				</view>
				<!-- <view class="bg_3A8CFF d-flex align-center justify-content-center" style="height: 90rpx;" @tap="submit">
					<view class="bg_fff f-s14 f-w400 d-flex-center" style="width: 50%;height: 90rpx;">退货</view>
					<view class="co_fff f-s14 f-w400 d-flex-center" style="width: 50%;height: 90rpx;">收款</view>
				</view> -->
			</view>
		</view>
		<wly-datetime-picker type="daterange" ref="wlyDatetime" @change="confirm" :isIcons="false"  />
	</view>
</template>

<script>
	export default {
		data() {
			return {
				index:0,
				array:['商品名称','商品编码'],
				list:[],
				total:'0.00',
				dateStatus:0,
				conditionStatus:0,
				dateList:[{name:'全部',id:null},{name:'未核销',id:21},{name:'已结清',id:180},{name:'已核销',id:283},{name:'未结清',id:428},{name:'已交清',id:1645},{name:'未交清',id:1646}],
				conditionList:[{name:'全部',id:null},{name:'生效',id:189},{name:'未审',id:181},],
				SaleOrderDetails:[],
				Pages:1,
				more:true,
				status:'noMore',
				dindanData:{TotalRecords:0},
				voucherState:0,
				cancelState:0,
				BeginDefault:'',
				EndDefault:''
			}
		},
		onLoad() {
			this.getData()
		},
		onReachBottom(){
			var _this = this;
		   if(_this.status == 'loading'){
				_this.Pages++
				_this.more=true;
				this.getData()
		   }
		},
		methods: {
			getData() {
				let SearchItems = []
				// 状态
				if(this.dateStatus != 0) {
					SearchItems.push({
						"ColumnName": "voucherState",
						"BeginDefault": this.dateList[this.dateStatus].id,
						"BeginDefaultText": this.dateList[this.dateStatus].id,
						"EndDefault": this.dateList[this.dateStatus].id,
						"EndDefaultText": this.dateList[this.dateStatus].id
					})
				}
				// 类型
				if(this.conditionStatus != 0) {
					SearchItems.push({
						"ColumnName": "cancelState",
						"BeginDefault": this.conditionList[this.conditionStatus].id,
						"BeginDefaultText": this.conditionList[this.conditionStatus].id,
						"EndDefault": this.conditionList[this.conditionStatus].id,
						"EndDefaultText": this.conditionList[this.conditionStatus].id
					})
				}
				if(this.BeginDefault != '' && this.EndDefault != '') {
					SearchItems.push({
						"ColumnName": "VoucherDate",
						"BeginDefault": this.BeginDefault,
						"BeginDefaultText": this.BeginDefault,
						"EndDefault": this.EndDefault,
						"EndDefaultText": this.EndDefault
					})
				}
				let resData = {
					SearchItems //查询项；
				}
				if(this.Pages>1) {
					resData.taskSessionID = this.dindanData.TaskSessionID
					resData.SolutionID = this.dindanData.SolutionID
				}
				this.$http.post(`valet_order/SA_SaleDeliveryDetailRpt?page_no=${this.Pages}&page_size=10`,resData).then(res => {
					if(res.code == 1) {
						this.dindanData = res.data
						if(this.Pages>1){
							this.list = this.list.concat(res.data.DataSource.Rows||[])
						}else{
							this.list = res.data.DataSource.Rows;
							this.more = false;
							this.status = 'loading'
						}
						if(res.data.DataSource.Rows.length==0){
							this.status = 'noMore';
							return;
						}
						this.more= false;
					}
				})
			},
			bindPickerChange(e) {
				this.index = e.detail.value
				if(this.index == 0) {
					this.Code = ''
				}else {
					this.Name = ''
				}
			},
			show() {
				this.$refs.wlyDatetime.show()
			},
			confirm(e) {
				if(this.BeginDefault == e[0] &&this.EndDefault == e[1]) {
					this.BeginDefault = '';
					this.EndDefault =  ''
				}else {
					this.BeginDefault = e[0];
					this.EndDefault =  e[1]
				}
				this.Pages = 1
				this.getData()
			},
			// 点击更多
			moreClick() {
				uni.showActionSheet({ 	
					itemList: ['复制', '删除'],
					success: function (res) {
						console.log('选中了第' + (res.tapIndex + 1) + '个按钮');
					},
					fail: function (res) {
						console.log(res.errMsg);
					}
				});
			},
			// 日期选择
			dateChange(e) {
				this.dateStatus = e.detail.value	
				this.Pages = 1
				this.getData()
			},
			//状态选择
			conditionChange(e) {
				this.conditionStatus = e.detail.value
				this.Pages = 1
				this.getData()
			},
			submit() {
				// this.$refs.wlyDatetime.show()
			}
		}
	}
</script>

<style lang="scss">
	.sousuo {
		height: 56rpx;
		border-radius: 56rpx;
		background: #f3f2f7;
	}
</style>